<template>
	<view class="content">
		<!-- <uni-payment ref="popup" :show='show'></uni-payment>	 -->
		<view class="userInfo">
			<block class="add" v-if="show">
				<view class="" @click="router"> 
					请选择收货地址
				</view>
			</block>

			<view class="head" v-if="!show">
				<view class="left">
					收货人 : {{info.receiver}}
				</view>
				<!-- 手机号 -->
				<view class="right">
					{{info.mobile}}
				</view>
			</view>
			<view class="address" v-if="!show">
				收货地址: {{info.province}}{{info.city}}{{info.area}}{{info.addr}}
			</view>

		</view>
		<!-- title 标题 -->
		<view class="main">
			<view class="title">
				<!-- 全局 -->
				富同商城
			</view>
			<view class="message">
				<view class="left">
					<image :src="commodity.pic" mode=""></image>

				</view>
				<view class="right">
					<view class="tit">
						{{commodity.prodName}}
					</view>
					<view class="size">
						<view class="size1">
							<!-- 净含量：100ML -->
						</view>
						<view class="money">
							￥{{100}}
						</view>
					</view>
				</view>
			</view>
			<!-- y运费 -->
			<view class="span">
				<view class="">
					运费
				</view>
				<view class="money" v-if="freight1 == true">
					{{freight}}
				</view>
				<view class="money" v-if="freight1 == false">
					￥{{postage}}
				</view>
			</view>
			<!-- z总计 -->
			<view class="sub">

				<view class="num">
					<text class="txt">共1件 </text> 小计 :<text>￥{{}}</text>
				</view>
			</view>

		</view>
		<!-- 留言 -->
		<view class="leave">
			<view class="head">
				留言
			</view>
			<view class="text">
				<u-input v-model="value" type="textarea" :border="false" :clearable='false'  :auto-height="false" />
			</view>
		</view>
		<!-- 底部提交 -->
		<view class="footer">
			<view class="total">
				合计:￥{{}}
			</view>
			<view class="submit" @click="toggle()">
				提交
			</view>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				globalData: "",
				value:'',
				info:"",
				commodity:'',
				show:false,
				freight:'包邮',
				freight1:true
			}
		},
		onLoad(message) {
			console.log(message)
			message=JSON.parse(message.message)
			this.commodity = message
			console.log(this.commodity)
			if(this.commodity.transport.isFreeFee == 1){
				this.freight = '包邮'
				this.freight1 = true
			}else{
				this.freight1 = false
			}
		},
		onShow() {
			let addrInfo = uni.getStorageSync('addrInfo');
			if(addrInfo.data == ''){
				this.show = true
			}else{
				for(let i=0;i<addrInfo.data.length;i++){
					if(addrInfo.data[i].commonAddr == 1){
						 this.info = addrInfo.data[i]
						 console.log(this.info)
					}
				}
			}
			
			// wx.getSystemInfo({
			// 	success: (res) => {
			// 		//将机型存入到本地缓存 以免后期其他业务逻辑需要使用
			// 		if (res.model === 'iPhone X' || 'iPhone XR' || 'iPhone XS Max' || 'iPhone 11' ||
			// 			'iPhone 11 Pro' || 'iPhone 11 Pro Max') {
			// 			this.globalData = true;
			// 		} else {
			// 			this.globalData = false;
			// 		}
			// 		console.log(this.globalData);
			// 	}
			// })
		},
		methods: {
			router(){
				uni.navigateTo({
					url:'../../my/site/addsite'
				})
			},
			toggle() {
				
			}
		}
	}
</script>

<style lang="scss">
	$bgcolor : blue;
	$color:#ffaa00;

	page {
		background-color: #efefef;
	}


	.content {
		position: relative;
	}

	.userInfo {
		width: 90%;
		margin: 20rpx auto;
		padding: 20rpx 30rpx;
		border-radius: 15rpx;
		background-color: #FFFFFF;

		.head {
			display: flex;
			justify-content: space-between;
			margin-bottom: 10rpx;
		}
	}

	.main {
		width: 90%;
		margin: 20rpx auto;
		border-radius: 15rpx;
		background-color: #FFFFFF;

		.title {
			padding: 25rpx;
			border-bottom: 3rpx solid #cbcbcb;
			font-weight: 600;
		}

		.message {
			display: flex;
			padding: 25rpx;
			border-bottom: 3rpx solid #cbcbcb;

			image {
				width: 200rpx;
				height: 200rpx;
			}

			.right {
				padding: 10rpx;

				.tit {
					overflow: hidden;
					display: -webkit-box;
					-webkit-box-orient: vertical;
					-webkit-line-clamp: 2;
				}

				.size {
					margin-top: 30rpx;

					.size1 {
						color: #999;
					}

					.money {
						margin-top: 10rpx;
					}
				}
			}

		}

		// 运费
		.span {
			display: flex;
			justify-content: space-between;
			padding: 30rpx;
			border-bottom: 3rpx solid #cbcbcb;

			.money {
				color: $color;
			}
		}

		// 小计 金额、
		.sub {
			text-align: right;
			padding: 30rpx;

			.num {
				.txt {
					color: #999;
					margin-right: 10rpx;
				}

				color: #000;

				text {
					color: $color;
				}
			}
		}

	}

	// 留言
	.leave {
		width: 90%;
		margin: auto;
		background-color: #fff;
		border-radius: 15rpx;

		.head {
			padding: 25rpx;
			border-bottom: 3rpx solid #cbcbcb;
			font-weight: 600;
		}

		.text {
			padding: 30rpx;
		}
	}

	// 提交
	.footer {
		width: 100%;
		height: 100rpx;
		background-color: #fff;
		position: fixed;
		bottom: 0;
		display: flex;
		justify-content: space-between;

		.total {
			margin-left: 30rpx;
			text-align: center;
			line-height: 100rpx;
			color: $color;
		}

		.submit {
			width: 30%;
			height: 100%;
			text-align: center;
			line-height: 100rpx;
			color: #fff;
			background-color: $color;

		}
	}
</style>
